<template>
	<view class="conter">
		<header-box :title="title"></header-box>
		<view class="box1">
			<view class="flex-box data">
				<view class="">
					日期
				</view>
				<view class="flex-center">
					{{dataTime | formatDate4}}
					<!-- <view class="data-image">
						<image src="../../static/index/right.png" mode="widthFix"></image>
					</view> -->
				</view>
			</view>
			<view class="flex-box data">
				<view class="">
					仓库
				</view>
				<view class="flex-center">
					{{stockName}}
					<!-- <view class="data-image">
						<image src="../../static/index/right.png" mode=""></image>
					</view> -->
				</view>
			</view>
		</view>



		<view class="box2">

			<!-- v-for="(item, index) in texList" :key="index" -->
			<view class="box3" @click="propShow">
				<view class="box-center f30">
					<view class="f-1 ">
						商品
					</view>
					<view class="f-1 text-center">
						盘点数
					</view>
					<view class="f-1 text-center">
						库存数
					</view>
					<view class="f-1 text-center">
						盈亏数
					</view>
				</view>
			</view>
			<view class="bor-top" v-for="(item, index) in stockList" :key="index">
				<view class="box-center1 f30">
					<view class="f-1 ">
						<image style="width: 100rpx; height: 100rpx;" :src="item.image" mode=""></image>
					</view>
					<view class="f-1 text-center">
						{{item.numberIfo}}
					</view>
					<view class="f-1 text-center">
						{{item.num}}
					</view>
					<view class="f-1 text-center">
						{{item.inputInfo}}
						<!-- <text v-if="balance == 0 "> {{item.numberIfo-item.num}}</text>
						<text v-if="balance == 1"> -{{item.numberIfo-item.num}}</text>
						<text v-if="balance == 2"> {{item.numberIfo-item.num}}</text> -->
					</view>
				</view>
				<view class="flex-box" style="padding-bottoms: 30rpx; height: 70rpx;">
					<view style="width: 220rpx;">{{item.name}}</view>
					<view class="" style="margin-right: 20rpx;">
						单位: {{item.unit}}
					</view>
				</view>
			</view>
		</view>


		<view class="bg-gradual-green sear-box" @click="addCheck">
			保存
		</view>





		<!-- 弹框输入数量 -->
		<u-popup v-model="showPopup" mode="center" width="580rpx" height="300rpx" border-radius="20">
			<view class="popup-title">
				羊毛丝绒被
			</view>
			<view class="popup-box">
				<input type="text" value="" placeholder="请输入" placeholder-style="padding-right: 0" />
			</view>
			<view class="popup-border flex-around">
				<view class="" @click="showPopup = false" style="background-color: #CCCCCC; border-radius: 30rpx;">
					取消
				</view>
				<view class="bg-gradual-green" style="border-radius: 30rpx;">
					确定
				</view>
			</view>
		</u-popup>




	</view>
</template>

<script>
	import headerBox from '../../components/header/header.vue'

	export default {
		components: {
			headerBox
		},
		data() {
			return {
				title: '盘点单',
				texList: [{
					text: '商品',
					class: '单位：件',
					stock: '51',
				}],
				showPopup: false,
				showPopup1: false,
				stockName: '',
				stockList: [],
				balance: 0,
				id: '',
				dataTime: '',
			}
		},
		onLoad(e) {
			this.stockName = uni.getStorageSync('stockName');
			this.id = uni.getStorageSync('stockId');
			this.getStockList()
			
			console.log('this.stock00000000000List', this.stockList)
		},
		onShow() {
			this.dataTime = Date.parse(new Date()) / 1000;
		},
		methods: {

			// 仓库列表
			getStockList() {
				this.stockList = uni.getStorageSync('addlist')
				var int = 0
				console.log(';this.stockList',this.stockList)
				this.stockList.forEach((item,index,i) => {
					item.inputInfo =  item.numberIfo - item.num
					console.log(item.numberIfo - item.num)
					console.log(0 - 10)
					console.log(20 - 10)
					
				})
			},

			propShow() {
				this.showPopup = true
			},


			// 保存
			async addCheck() {
				this.stockList.forEach((item, index, i) => {
					delete item.mmm
					delete item.name
					delete item.unit
					delete item.image
					delete item.inputInfo
				})
				console.log(this.stockList)
				const res = await this.$u.post("api/jinxiao.Check/check",{
					store_id: this.id,
					time: this.dataTime,
					goods: JSON.stringify(this.stockList),
				})
				if(res.code != 1) return this.$tools.msg('保存失败')
				this.$tools.msg(res.msg)
				// uni.navigateTo({
				// 	url: '/pages/stock/index'
				// })
					uni.navigateBack({
						delta: 3
					})
				 uni.removeStorageSync('addlist');
				 uni.removeStorageSync('stockId');
			}
		}
	}
</script>

<style lang="scss" scoped>
	.conter {
		width: 100%;
		height: 100%;
		position: relative;
		padding-bottom: 100rpx;

		image {
			width: 100%;
			height: 100%;
		}

		.box1 {
			width: 90%;
			height: 182rpx;
			// height: 92rpx;
			margin: 30rpx auto;
			padding: 0 35rpx;
			color: #333333;
			font-size: 28rpx;
			border-radius: 10rpx;
			background-color: #FFFFFF;

			.data {
				width: 100%;
				height: 86rpx;
				border-bottom: 1rpx solid #F0F0F0;

				.data-image {
					width: 22rpx;
					height: 36rpx;
					margin-left: 12rpx;
				}
			}

			.data:last-child {
				border-bottom: 0;
			}
		}

		.box2 {
			width: 90%;
			margin: 30rpx auto;
			padding-left: 35rpx;
			color: #333333;
			font-size: 28rpx;
			border-radius: 10rpx;
			background-color: #FFFFFF;

			.box3 {
				width: 100%;
				padding-bottom: 10rpx;
			}

			.box-center-box {
				width: 100%;
				font-weight: 700;
				font-family: PingFang SC;
				padding-bottom: 30rpx;
				// border-bottom: 1rpx solid #F5F5F5;

				.color-size {
					color: #FFFFFF;
				}
			}

			.box3:last-child {
				border-bottom: 0;
			}

			.box-center {
				color: #000000;
				font-weight: bold;
				padding-top: 30rpx;
				display: flex;
				font-family: PingFang SC;
				align-items: center;
				justify-content: space-between;
			}

			.box-center1 {
				color: #000000;
				padding-top: 30rpx;
				display: flex;
				font-family: PingFang SC;
				align-items: center;
				justify-content: space-between;
			}

			.bor-top {
				padding-top: 10rpx;
				border-top: 1rpx solid #F5F5F5;

				.add-class {
					font-size: 26rpx;
					height: 50rpx;
					line-height: 50rpx;
				}
			}


		}


		.bor-bot {
			position: absolute;
			bottom: 0;
			right: 0;
			width: 100%;
			height: 120rpx;
			z-index: 100;
			padding: 0 30rpx;
			background-color: #FFFFFF;

			.bor-bot1 {
				width: 30%;
				// margin: 0 auto;
				text-align: center;

				.bor-image {
					margin: 0 auto;
					width: 50rpx;
					height: 50rpx;
				}
			}
		}



		.sear-box {
			position: absolute;
			left: 50%;
			bottom: 40rpx;
			width: 90%;
			height: 70rpx;
			line-height: 70rpx;
			color: #FFFFFF;
			text-align: center;
			transform: translateX(-50%);
			border-radius: 35rpx;
		}



		// 弹框
		.popup-title {
			height: 96rpx;
			font-size: 32rpx;
			text-align: center;
			line-height: 96rpx;
		}

		.popup-box {
			width: 80%;
			height: 70rpx;
			margin: 0 auto;
			border-radius: 10rpx;
			background-color: #F5F5F5;

			input {
				width: 100%;
				height: 100%;
				padding-left: 31rpx;
			}
		}

		.popup-border {
			display: flex;
			margin-top: 35rpx;

			view {
				width: 30%;
				height: 60rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 60rpx;
			}
		}


		.shop-box {
			width: 100%;
			height: 98rpx;
			line-height: 98rpx;
			padding: 0 30rpx;
			font-size: 24rpx;
			background-color: #F5F5FA;
			font-family: PingFang SC;
		}

		.box-shop {
			width: 100%;
			padding: 0 30rpx;

			.shopping-info {
				border-bottom: 1rpx solid #F5F5F5;

				.heig-shop {
					height: 70rpx;
					line-height: 70rpx;
				}
			}

			.shopping-info:last-child {
				border-bottom: 0;
			}
		}

	}
</style>
